<template>
  <scroll
      :data="data"
      :pullUpLoad="true"
      :pullUpText="pullUpText"
      @pullingUp="loadMore"
      @touchStart="touchStart"
      :bounce="true"
      :pullDownRefresh="true"
      :pullDownText="downText"
      @pullingDown="pullingDown"
      ref="scroll">
    <div class="header-h"></div>
    <div class="evaluate">
      <div class="title">评价</div>
      <evaluate-list :list="evaluate"></evaluate-list>
    </div>
  </scroll>
</template>

<script>
  import scroll from '@/components/scroll/scroll';
  import evaluateList from '@/components/evaluate-list/evaluate-list';
  import server from '@/api/server/index';
  import {Toast} from 'mint-ui';

  export default {
    props: {
      id: Array
    },
    data() {
      return {
        page: 0,
        data: [],
        evaluate: [],
				downText:'下拉去详情页',
        pullUpText: false,
        count: 0,
        pullUpLoad: true
      }
    },
    mounted() {
      this.__init();
    },
    methods: {
      __init() {
				this.$refs.scroll && this.$refs.scroll.closePullUp();
        this.__evaluateList().then(() => {
        });
      },
      __evaluateList() {
        let p = new Promise((resolve, reject) => {
          this.page++;
          let params = {
            page: this.page,
            id: this.id
          };
          server.evaluateList(params).then((rs) => {
            this.evaluate = this.evaluate.concat(rs.list);
            this.count = rs.count;
            if (this.count > 1) {
							try{
								this.$refs.scroll && this.$refs.scroll.openPullUp();
							}catch (err){}
              this.pullUpText = true;
            }
            this.__finishPullUp();
            resolve();
          }).catch((ms) => {
            Toast(ms);
          })
        });
        return p;
      },
      touchStart(e){
        e.stopPropagation();
      },
      loadMore() {
        this.__evaluateList((rs) => {
          this.__finishPullUp();
        });
      },
			pullingDown(){
				this.$refs.scroll && this.$refs.scroll.finishPullDown();
				this.$emit('loadMore', 1);
			},
      __finishPullUp() {
        if (this.count <= this.page) {
					this.$refs.scroll && this.$refs.scroll.closePullUp();
        } else {
					this.$refs.scroll && this.$refs.scroll.finishPullUp();
        }
        setTimeout(() => {
					this.$refs.scroll && this.$refs.scroll.refresh();
        }, 20);
      }
    },
    components: {
      scroll,
      evaluateList
    }
  }
</script>

<style scoped lang="less">
  @import '../../common/less/variable';

  .scroll {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
    background-color: @color-background-l;
  }

  .header-h {
    height: 42px;
  }

  .evaluate {
    padding: 10px 10px 5px 10px;
    .title {
      padding: 10px 0;
    }
  }
</style>

